<!doctype html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>
    <link rel="stylesheet" type="text/css" th:href="@{/css/styles.css}">
    <!--[if IE]>
    <script src="http://libs.baidu.com/html5shiv/3.7/html5shiv.min.js"></script>
    <![endif]-->
    <script th:src="@{/js/index.js}" type="text/javascript"></script>
</head>
<body>
<div class="jq22-container" style="padding-top:100px">
    <div class="login-wrap">
        <div class="login-html">
            <input id="tab-1" type="radio" name="tab" class="sign-in" checked><label for="tab-1" class="tab">登录</label>
            <input id="tab-2" type="radio" name="tab" class="sign-up"><label for="tab-2" class="tab">注册</label>
            <div class="login-form">
                <div class="sign-in-htm">
                    <br>
                    <h2 th:text="${msg}" th:if="${!#strings.isEmpty(msg)}"></h2>
                    <br>

                    <form name="loginFrom" onsubmit="return loginOnSubmit()" th:action="@{/user/accountLogin}" method="post">
                        <div class="group">
                            <label for="loginUser" class="label">用户名(邮箱)</label>
                            <a id="userLabel" for="user" style="color: crimson;padding-left: 5%;"></a>
                            <input id="loginUser" name="userName" type="text" class="input" onchange="loginOnchange()">
                        </div>
                        <div class="group">
                            <label for="loginPass" class="label">密码</label>
                            <a id="passLabel" for="user" style="color: crimson;padding-left: 5%;"></a>
                            <input id="loginPass" type="password" name="password" class="input">
                        </div>
                        <br>
                        <div class="group">
                            <input type="submit" class="button" value="登录">
                        </div>
                    </form>

                    <div class="hr"></div>
                    <div class="foot-lnk">
                        <a th:href="@{/repassword}">忘记密码</a>
                    </div>
                </div>
                <div class="sign-up-htm">
                    <form name="accountFrom" onsubmit="return beforeSubmit()" th:action="@{/user/saveUser}" method="post" >
                        <div class="group">
                            <label for="email" class="label">邮箱</label>
                            <input  id="email" type="text" class="input" name="username"/>
                        </div>
                        <div class="group">
                            <label for="password" class="label">密码</label>
                            <input  id="password" class="input" type="text" name="password">
                        </div>
                        <div class="group">
                            <label for="password2" class="label">重复密码</label>
                            <input class="input" id="password2" type="password" name="password2">
                        </div>
                        <div class="group">
                            <label for="sendText" class="label">验证码</label>
                            <input id="sendText" name="yzm" type="text" class="input" style="width: 50%; display: inline-block;">
                            <input class="button" type="button"  id="sendBtn" value="获取验证码" onclick="getYzm(this)" style="width: 48.5%;  display: inline-block;"/><br>

                        </div>
                        <div class="group">
                            <input class="button" type="submit" value="保存" >
                        </div>
                        <div class="hr"></div>
                        <div class="foot-lnk">
                            <a th:href="@{/repassword}">忘记密码</a>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

</body>
</html>